<template>
  <yt-page title="设备列表" :rightData="rightData">
    <yt-group ref="group" :searchApi="searchApi" :group="false">
      <yt-card
        slot-scope="item"
        :title="item.DeviceName">
        <yt-cell label="设备类型" :value="item.DeviceCategory"></yt-cell>
        <yt-cell label="报警上限" :value="item.AlarmUpperThreshold"></yt-cell>
        <yt-cell label="报警下限" :value="item.AlarmLowerThreshold"></yt-cell>
        <yt-cell label="实时值" :value="item.value"></yt-cell>
        <yt-cell label="管理部门" :value="item.AdminDepartment"></yt-cell>
        <yt-cell label="管理人员" :value="item.AdminPersonnel"></yt-cell>
      </yt-card>
    </yt-group>
    <yt-popup pos="right" v-model="search" :mask="true" slot="alert">
      <yt-page class="page" :flex="true" :leftData="[]" title="设备类型">
        <yt-form>
          <yt-inlineSelect v-model="deviceCategoryDicSlected" :list="deviceCategoryDic" :x="2" label="D_text" val="D_text" multiple></yt-inlineSelect>
          <yt-btn-group slot="btn" :shadow="false">
            <yt-btn theme="white" @click="search = false">关闭</yt-btn>
            <yt-btn @click="onSearch">确定</yt-btn>
          </yt-btn-group>
        </yt-form>
      </yt-page>
    </yt-popup>
  </yt-page>
</template>

<script>
import { commonApi } from '@/common/api/commonApi.js'
import { ReplaceDictionary } from '@/common/utils/index.js'
export default {
  data () {
    return {
      rightData: [{
        font: 'yt-icon yt-icon-search',
        click: () => {
          this.search = !this.search
        }
      }],
      search: false,
      deviceCategoryDic: [],
      deviceCategoryDicSlected: [],
      searchApi: async ({ skip, limit }) => {
        let dicBefor = await commonApi.dictionary('equipment_category')
        let exclude = ['equipment_category_camera']
        let dicAfter = dicBefor.filter(v => exclude.indexOf(v.D_code) === -1)
        if (!this.deviceCategoryDicSlected.length) {
          dicAfter.forEach(v => {
            this.deviceCategoryDicSlected.push(v.D_text)
          })
        }
        let items = await commonApi.search('measure_automation', { equalTo: { gridId: this.$route.query.gridId }, containedIn: { DeviceCategory: this.deviceCategoryDicSlected }, skip, limit })
        this.deviceCategoryDic = dicAfter
        return ReplaceDictionary(items, { 'DeviceCategory:D_text:D_code': dicAfter })
      }
    }
  },
  methods: {
    onSearch () {
      this.search = false
      this.$refs.group.startPull()
    }
  }
}
</script>

<style lang="stylus" scoped>
>>>.yt-card-body
  padding 0
</style>
